<template>
    <div class="admin-aside-panel">
        <div :class="{
            'admin-aside-head' : true,
            'admin-aside-head-collapse' : $local.isCollapse,
        }">
                <div
                        class="admin-aside-head-logo"
                        v-show="!$local.isCollapse"
                        @click="onMorefansClick">MoreFans</div>
                <div
                        class="admin-aside-head-logo"
                        v-show="$local.isCollapse"
                        @click="onMorefansClick">M</div>
        </div>
        <div class="admin-aside">
            <el-menu
                    class="el-admin-menu admin-aside"
                    background-color="#545c64"
                    text-color="#fff"
                    active-text-color="#ffd04b"
                    :collapse="$local.isCollapse"
                    :collapseTransition="false"
                    :router="true"
                    :unique-opened="true"
                    :default-active="active"
            >

                <admin-side-menu
                    title="明星管理"
                    url="/stars/home/page"
                    icon="fa fa-user-md"
                ></admin-side-menu>
                <admin-side-menu
                        title="APP配置管理"
                        url="/config"
                        icon="fa fa-user-md"
                ></admin-side-menu>

                <el-submenu index="1">
                    <template slot="title">
                        <i class="el-icon-location"></i>
                        <span>广告管理</span>
                    </template>
                    <admin-side-menu
                        title="开机屏"
                        url="/advert/calendar/0"
                        icon="fa fa-user-md"
                    />
                    <admin-side-menu
                            title="明星页 Banner"
                            url="/advert/calendar/1"
                            icon="fa fa-user-md"
                    />
                    <admin-side-menu
                            title="首页 Banner"
                            url="/advert/calendar/2"
                            icon="fa fa-user-md"
                    />
                    <admin-side-menu
                            title="首页 信息流"
                            url="/advert/calendar/3"
                            icon="fa fa-user-md"
                    />
                </el-submenu>

                <el-submenu index="2">
                    <template slot="title">
                        <i class="el-icon-location"></i>
                        <span>审核管理</span>
                    </template>
                    <admin-side-menu
                            title="粉丝站审核"
                            url="/apply/club"
                            icon="fa fa-user-md"
                    />
                    <admin-side-menu
                            title="提现审核"
                            url="/apply/withdraw"
                            icon="fa fa-user-md"
                    />
                </el-submenu>
            </el-menu>
        </div>
    </div>

</template>
<script lang="ts">
    import {Vue, Component} from 'vue-property-decorator'
    import AdminSideMenu from './AdminSideMenu'



    @Component({
        name:"AdminSide",
        components: {AdminSideMenu},
        component: AdminSideMenu
    })
    export default class AdminSide extends Vue {

        active: string = "";

        onMorefansClick() {
            this.$router.push({
                path:"/",
            })
        }

        mounted() {

            this.active = this.$route.path;

            this.$local.$on('onRouteChanged', (to) =>{

                console.log("to",to.path);
                this.active = to.path;
            })
        }

        created() {

        }
    }


</script>

